<template>
	<div class="order-price-info">
		<el-popover placement="left" title="" width="200" trigger="hover">
			<price-table :price-table="modelValue.price_table" />
			<template #reference>
				<div class="price-text">
					<div>
						{{ getMoneyByMinute(modelValue.total_price) }}
						<template v-if="modelValue.is_modfiy_price > 0">
							<el-icon color="#f00"><sc-icon-exchange-cny-line /></el-icon>
						</template>
					</div>
					<div>运费({{ getMoneyByMinute(modelValue.dispatch_price) }})</div>
				</div>
			</template>
		</el-popover>
		<template v-if="modelValue.status == 1">
			<div>
				<div class="option-item">
					<el-button
						type="text"
						class="btn-link"
						@click="openChangePriceDialog(modelValue.id)"
						>订单改价</el-button
					>
				</div>
				<div class="option-item">
					<el-button type="text" class="btn-link danger" @click="backPayIsOk()"
						>后台付款</el-button
					>
				</div>
			</div>
		</template>
	</div>
	<change-price-dialog ref="orderChangePriceDialog" @changeOk="priceChangeOk" />
</template>

<script>
import priceTable from "./orderPriceTable.vue";
import "./common.scss";
import changePriceDialog from "./orderChangePriceDialog.vue";
export default {
	name: "order-price-info",
	components: {
		priceTable,
		changePriceDialog
	},
	props: {
		modelValue: { type: Object, default: () => {} }
	},
	emits: ["update:modelValue", "changeOk"],
	methods: {
		getStatusText(_status) {
			_status = _status.toString();
			switch (_status) {
				case "0":
					return "关闭";
				case "1":
					return "待付款";
				case "2":
					return "待备货";
				case "3":
					return "待发货";
				case "4":
					return "待收货";
				case "5":
					return "待评价";
				case "99":
					return "已完成";
			}
			return "";
		},
		getMoneyByMinute(_value) {
			let tmp = '';
			if (_value < 0) {
				tmp = '-￥';
			}
			else {
				tmp = '￥';
			}
			return tmp + this.$TOOL.getMoneyByMinute(Math.abs(_value));
		},
		openChangePriceDialog(_orderId) {
			console.log(_orderId);
			// this.$refs["orderChangePriceDialog"].openDialog(_orderId);
			this.$refs["orderChangePriceDialog"].setDataAndShow(this.modelValue);
		},
		backPayIsOk() {
			let _this = this;
			this.$confirm(
				"确认 " +
					_this.modelValue.order_no +
					' <span style="color:#F00">后台付款</span>吗？',
				"提示",
				{
					confirmButtonText: "确定",
					cancelButtonText: "取消",
					dangerouslyUseHTMLString: true,
					type: "warning"
				}
			).then(() => {
				let formData = {};
				formData["type"] = "back_pay";
				formData["order_id"] = _this.modelValue.id;
				this.service.shop.order
					.changeStatus(formData)
					.then((res) => {
						if (res.code === 0) {
							_this.$message.success("后台付款成功");
							_this.priceChangeOk(res.data);
						}
						else {
							this.$message.error(res.message);
						}
					})
					.catch((err) => {
						this.$message.error(err);
					});
			});
		},
		priceChangeOk(backData) {
			this.$emit("changeOk", backData);
		}
	}
};
</script>

<style scoped lang="scss">
.order-price-info {
	.price-text {
		cursor: pointer;
		color: #00a0e9;
	}
	.el-icon-money {
		color: #f00;
	}
}
</style>
